import React, { Component } from 'react'
import classnames from "classnames"
import style from './styles/sellerCenter.less'
import util from "commons/util";
//img
import icon_close from "./images/icon_close.png";
//api
import {query_statistics,query_sum_incomes} from 'api_xukaiyu/app/seller'

export default class sellerCenter extends Component {
    constructor() {
        super();
        this.state = {
            dispute: true,
            queryStatistics:{}
        }
    }
    componentDidMount(){
        util.setPageTitle('卖家中心');
        query_statistics().then(data=>{
            this.setState({
                queryStatistics:data.data
            })
        })
    }
    render() {
        const { dispute,queryStatistics,querySumIncomes} = this.state;
        return (
            <div className={style.container}>
                <div hidden={!dispute} className={style.disputeTips}>请及时处理纠纷，若有疑问请与客服联系 <span onClick={() => {
                    this.setState({
                        dispute: false
                    })
                }}><img src={icon_close} alt="" /></span></div>
                <div className={style.header}>
                    <div>
                        <div className={style.name}>可提金额</div>
                        <div className={style.num}><span>¥</span>{queryStatistics.balance}</div>
                    </div>
                    <div>
                        <div className={style.name}>冻结金额</div>
                        <div className={style.num}><span>¥</span>{queryStatistics.frozenAmount}</div>
                    </div>
                </div>
                <div className={style.orderPreview}>
                    <div className={style.title}>订单概览</div>
                    <div>
                        <table>
                            <tr>
                                <td>
                                    <div className={style.name}>累计销售量</div>
                                    <div className={style.num}>{queryStatistics.totalOrderNum}</div>
                                </td>
                                <td>
                                    <div className={style.name}>累计销售额</div>
                                    <div className={style.num}>¥{queryStatistics.totalOrderAmount}</div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <div className={style.name}>今日销售量</div>
                                    <div className={style.num}>{queryStatistics.orderNumToday}</div>
                                </td>
                                <td>
                                    <div className={style.name}>今日销售额</div>
                                    <div className={style.num}>¥{queryStatistics.totalTradeAmount}</div>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div className={style.disputeOrder}>纠纷订单
                    <div onClick={()=>{queryStatistics.totalAppealGoodsNum&&(location.href = "./myCenter.html#/AppealList")}} className={classnames(style.num,{[style.noOrder]:queryStatistics.totalAppealGoodsNum})}>{queryStatistics.totalAppealGoodsNum}</div>
                </div>
                <div className={classnames(style.orderPreview,style.accoutDetail)}>
                    <div className={style.title}>账户详情</div>
                    <div>
                        <table>
                            <tr>
                                <td>
                                    <div className={style.name}>邀请人数</div>
                                    <div className={style.num}>{queryStatistics.recommendedNum}</div>
                                </td>
                                <td>
                                    {/* <div className={style.name}>累计返利</div>
                                    <div className={style.num}>¥ 0</div> */}
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        )
    }
}
